﻿<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>

<![endif]-->
<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
	<script type="text/javascript" src="lib/jquery/echarts/echarts.min.js"></script>
	<script type="text/javascript" src="lib/jquery/echarts/jquery-1.7.2.js"></script>
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>

<![endif]-->
<title>我的桌面</title>
</head>
<body>
<div class="page-container">
	<p class="f-20 text-success">欢迎登录music小程序后台管理！</p>
	<table class="table table-border table-bordered table-bg">
		<thead>
			<tr>
				<th colspan="7" scope="col">信息统计</th>
			</tr>
			<tr class="text-c">
				<th>统计</th>
				<th>歌曲</th>
				<th>访问量</th>
				<th>用户</th>
				<!--<th>管理员</th>-->
			</tr>
		</thead>
		<tbody>
			<tr class="text-c">
				<td>总数</td>
				<td th:text="${allMusic}">92</td>
				<td th:text="${allVisit}">9</td>
				<td th:text="${allUser}">8</td>
				<!--<td>20</td>-->
			</tr>
			<tr class="text-c">
				<td>今日</td>
				<td th:text="${dayMusic}">0</td>
				<td th:text="${dayVisit}">0</td>
				<td th:text="${dayUser}">0</td>
				<!--<td>0</td>-->
			</tr>
			<tr class="text-c">
				<td>本周</td>
				<td th:text="${weekMusic}">2</td>
				<td th:text="${weekVisit}">0</td>
				<td th:text="${weekUser}">0</td>
				<!--<td>0</td>-->
			</tr>
			<tr class="text-c">
				<td>本月</td>
				<td th:text="${monthMusic}">2</td>
				<td th:text="${monthVisit}">0</td>
				<td th:text="${monthUser}">0</td>
				<!--<td>0</td>-->
			</tr>
		</tbody>
	</table>
	<table class="table table-border table-bordered table-bg mt-20">
		<thead>
		    <tr>
				<th colspan="2" scope="col">图形统计</th>
			</tr>
		</thead>
		<tbody>
		    <tr>
			    <td>

						<table class="table table-border table-bordered table-bg mt-20" style="width: 100%;height: 350px;margin-bottom: 80px">
							<thead>
							<tr>
								<th colspan="2" scope="col">
									<div style="color: red; float: left">审核通知:</div>
									<div id="marquee" class="marquee" style="float: left">
										<div id="holder">
											<div style="font-size: 14px ;" th:each="s:${userNotice}">
												<a href="member-del.html" title="用户审核" style="color: #00a0e9" th:text="${s.nickname}">没有待审核用户</a>
											</div>

											<div style="font-size: 14px" th:each="m:${musicNotice}">
												<a href="/song/getAuditList/11" title="音乐审核" style="color: #00a0e9" th:text="${m.musicName}">没有待审核音乐</a>
											</div>

										</div>
									</div>
								</th>
							</tr>
							</thead>
							<tbody>
							       <tr style="height: 180px">
									   <td style="width: 200px;background-image: url('/temp/Thumb/weather.jpg');" rowspan="2">
										   <div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6ae;</i></div>
										   <div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Sunny Day</div>
									   </td>
									   <td>
										   <div class="week_month_day" style="margin-left: 10px;margin-bottom: 60px; font-size: 30px" >
											   <span id="week" class="week" style="color: #285e8e">周六</span><br><br>
											   <span id="month_day" class="month_day" style="color: #7274A7">2019/4/20</span>
										   </div>

										   <div class="air" style="margin-left: 10px">
											   <span id="airTemperature" style="font-size: 35px;color: mediumslateblue">26℃</span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="weather" style="font-size: 25px;color: mediumpurple">Sunny</span>
										   </div>
									   </td>
								   </tr>
								   <tr >
									   <td>
										   <div class="MON" style="float: left;margin-left: 5%">
											   <span id="MON_week" style="font-size: 12px">周一</span><br><br>
											   <span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="MON_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="TUE" style="float: left;margin-left: 5%">
											   <span id="TUE_week" style="font-size: 12px">周二</span><br><br>
											   <span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="TUE_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="WED" style="float: left;margin-left: 5%">
											   <span id="WED_week" style="font-size: 12px">周三</span><br><br>
											   <span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="WED_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="THU" style="float: left;margin-left: 5%">
											   <span id="THU_week" style="font-size: 12px">周四</span><br><br>
											   <span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="THU_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="FRI" style="float: left;margin-left: 5%">
											   <span id="FRI_week" style="font-size: 12px">周五</span><br><br>
											   <span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="FRI_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="SAT" style="float: left;margin-left: 5%">
											   <span id="SAT_week" style="font-size: 12px">周六</span><br><br>
											   <span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="SAT_air" style="font-size: 12px">16℃</span>
										   </div>
										   <div class="SUN" style="float: left;margin-left: 5%">
											   <span id="SUN_week" style="font-size: 12px">周日</span><br><br>
											   <span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span><br>
											   <span id="SUN_air" style="font-size: 12px">16℃</span>
										   </div>
									   </td>
								   </tr>
							</tbody>
						</table>

			    </td>
			    <td>
				    <div id="brokenLine" style="width: 600px;height:400px"></div>
			    </td>
		    </tr>
		    <tr>
			    <td >
				    <div id="dendrogram" style="width: 600px;height:400px"></div>
				</td>
			    <td >
				    <div id="FanChart" style="width: 600px;height:400px"></div>
				</td>
			</tr>
		</tbody>
	</table>
</div>
<footer class="footer mt-20">
	<div class="container">
		<p>感谢jQuery、layer、laypage、Validform、UEditor、My97DatePicker、iconfont、Datatables、WebUploaded、icheck、highcharts、bootstrap-Switch<br>
			Copyright &copy;2015-2017 H-ui.admin v3.1 All Rights Reserved.<br>
			本后台系统由<a href="http://www.h-ui.net/" target="_blank" title="H-ui前端框架">H-ui前端框架</a>提供前端技术支持</p>
			<p>More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
	</div>
</footer>
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript">
	//时间格式转换
    Date.prototype.Format = function (fmt) {
        var o = {

            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "H+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }
    $(function(){

        $.Huimarquee(22,30,3000);

        var cityName = "";
        var myDate = new Date().Format("yyyy-MM-dd");

        //获取城市ajax
        $.ajax({
            url: 'http://api.map.baidu.com/location/ip?ak=KZBGP5Kg5H5iWoY9GADjpmMcYIEephaW',
            type: 'POST',
            dataType: 'jsonp',
            success:function(data) {
                cityName = (JSON.stringify(data.content.address_detail.city)).substring(1,(JSON.stringify(data.content.address_detail.city).length-2));
            }
        });

		//获取本地当前时间天气
        $.ajax({
            type: 'GET',
            url: 'https://www.tianqiapi.com/api/',
            data: 'version=v1&city='+cityName,
            dataType: 'JSON',
            error: function () {
                alert('网络错误');
            },
            success: function (res) {
                for(var i=0; i<res.data.length;i++){
                    var end ="";
                    var time = res.data[i].date;
                    var week = res.data[i].week;
                    var airTemperature = parseInt((parseInt(res.data[i].tem) +parseInt(res.data[i].tem1)+parseInt(res.data[i].tem2))/3)+"℃";
                    var weather = res.data[i].wea
                    if(myDate==res.data[i].date){
                        time = time.substring(0,4)+'/'+time.substring(5,7)+'/'+time.substring(8,10);
                        $("#month_day").replaceWith('<span id="month_day" class="month_day" style="color: #7274A7">'+time+'</span>');
                        $("#week").replaceWith('<span id="week" class="week" style="color: #285e8e">'+week+'</span>');
                        $("#airTemperature").replaceWith('<span id="airTemperature" style="font-size: 35px;color: mediumslateblue">'+airTemperature+'</span>');
                        $("#MON_week").replaceWith('<span id="MON_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#MON_air").replaceWith('<span id="MON_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6ae;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Sunny Day</div>')
                                $("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Sunny</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
								continue;
                            case '雪':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6b0;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Snowy Day</div>')
                                $("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Snowy</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6b2;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Rainy Day</div>')
								$("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Rainy</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6af;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Fog Day</div>')
								$("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Fog</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6ad;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Haze Day</div>')
								$("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Haze</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6ac;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Cloudy Day</div>')
								$("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Cloudy</span>')
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#day_icon").replaceWith('<div id="day_icon" class="day_icon" style="margin-left: 130px;color: white;font-size: 60px"><i class="Hui-iconfont">&#xe6b1;</i></div>')
                                $("#describe").replaceWith('<div id="describe" class="describe" style="margin-top: 150px;margin-left: 30px;color: white;font-size: 20px">Overcast Day</div>')
								$("#weather").replaceWith('<span id="weather" style="font-size: 25px;color: mediumpurple">Overcast</span>');
                                $("#MON_i").replaceWith('<span id="MON_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
                    if (i==1){
                        $("#TUE_week").replaceWith('<span id="TUE_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#TUE_air").replaceWith('<span id="TUE_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#TUE_i").replaceWith('<span id="TUE_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
					}
                    if (i==2){
                        $("#WED_week").replaceWith('<span id="WED_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#WED_air").replaceWith('<span id="WED_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#WED_i").replaceWith('<span id="WED_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
                    if (i==3){
                        $("#THU_week").replaceWith('<span id="THU_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#THU_air").replaceWith('<span id="THU_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#THU_i").replaceWith('<span id="THU_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
                    if (i==4){
                        $("#FRI_week").replaceWith('<span id="FRI_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#FRI_air").replaceWith('<span id="FRI_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#FRI_i").replaceWith('<span id="FRI_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
                    if (i==5){
                        $("#SAT_week").replaceWith('<span id="SAT_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#SAT_air").replaceWith('<span id="SAT_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#SAT_i").replaceWith('<span id="SAT_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
                    if (i==6){
                        $("#SUN_week").replaceWith('<span id="SUN_week" title="'+res.data[i].date+'" style="font-size: 12px">'+week+'</span>');
                        $("#SUN_air").replaceWith('<span id="SUN_air" style="font-size: 12px">'+airTemperature+'</span>');

                        if(weather.length==1){
                            end=weather;
                        }else {
                            end =weather.substring(weather.length-1,weather.length);
                        }
                        switch(end){
                            case '晴':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ae;</i></span>');
                                continue;
                            case '雪':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b0;</i></span>');
                                continue;
                            case '雨':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b2;</i></span>');
                                continue;
                            case '雾':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6af;</i></span>');
                                continue;
                            case '霾':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ad;</i></span>');
                                continue;
                            case '云':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6ac;</i></span>');
                                continue;
                            case '阴':
                                $("#SUN_i").replaceWith('<span id="SUN_i" style="font-size: 30px"><i class="Hui-iconfont">&#xe6b1;</i></span>');
                                continue;
                        }
                    }
				}
            }
        });

        //圆形图
        $.ajax({
            url: 'statisticsUser',
            type: 'post',
            async: true,
            dataType: 'json',
            success: function (result) {
                var data1 = [];
                var data2 = [];
                $.each(result, function (d) {
                    data1[d] = result[d].NAME;
                    data2[d] = result[d].人数;
                });
                var FanChart = echarts.init(document.getElementById('FanChart'));
                var option = {
                    title : {
                        text: '音乐人与普通用户对比',
                        subtext: '人数对比',
                        x:'center'
                    },
                    tooltip : {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    legend: {
                        orient: 'vertical',
                        left: 'left',
                        data: [data1[0],data1[1]]
                    },
                    series : [
                        {
                            name: '人数及比例',
                            type: 'pie',
                            radius : '55%',
                            center: ['50%', '60%'],
                            data:[
                                {value:data2[0], name:data1[0]},
                                {value:data2[1], name:data1[1]},
                            ],
                            itemStyle: {
                                emphasis: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                                }
                            }
                        }
                    ]
                };
                FanChart.setOption(option)
            },
            error: function () {
                alert("不好意思,图表请求数据失败啦!");
            }
        });

        //折线图
        $.ajax({
            url: 'accessStatistics',
            type: 'post',
            async: true,
            dataType: 'json',
            success: function (result) {
                var data1 = [];
                var data2 = [];
                $.each(result, function (d) {
                    data1[d] = result[d].num;
                    data2[d] = "第"+(d+1)+"天"
                });
                var brokenLine = echarts.init(document.getElementById('brokenLine'));
                var option3 = {
                    title: {
                        text: '小程序访问量近7天统计'
                    },
                    tooltip: {},
                    xAxis: {
                        type: 'category',
                        data: [data2[0], data2[1], data2[2], data2[3], data2[4], data2[5], data2[6]]
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [{
                        data: [data1[0], data1[1], data1[2], data1[3], data1[4], data1[5], data1[6]],
                        type: 'line',
                        smooth: true
                    }]
                };
                brokenLine.setOption(option3);
            },
            error: function () {
                alert("不好意思,图表请求数据失败啦!");
                brokenLine.hideLoading();
            }
        });

        //柱状图
        $.ajax({
            url: 'statisticsMusic',
            type: 'post',
            async: true,
            dataType: 'json',
            success: function (result) {
                var data1 = [];
                var data2 = [];
                $.each(result, function (d) {
                    data1[d] = result[d].NAME;
                    data2[d] = result[d].数量;
                });
                var DendrogramChart = echarts.init(document.getElementById('dendrogram'));
                var option2 = {
                    title: {
                        text: '各类歌曲数量统计'
                    },
                    tooltip: {},
                    legend: {
                        data:['数量']
                    },
                    xAxis: {
                        data: [data1[0],data1[1],data1[2],data1[3],data1[4],data1[5]]
                    },
                    yAxis: {},
                    series: [{
                        name: '数量',
                        type: 'bar',
                        data: [data2[0], data2[1], data2[2], data2[3],data2[4],data2[5]]
                    }]
                };
                DendrogramChart.setOption(option2);
            },
            error: function () {
                alert("不好意思,图表请求数据失败啦!");
                DendrogramChart.hideLoading();
            }
        });

        //天气、通知

    })

</script>
</body>
</html>